<%- include('header', {type: 'login'}) %>
<div class="wrapper">
  <form method="post" class="form form-login">
    <div class="form-item">
      <label>用户名：</label>
      <input type="text" name="name" placeholder="请输入用户名"/>
    </div>
    <div class="form-item">
      <label>密码：</label>
      <input type="password" name="password" placeholder="请输入密码"/>
    </div>
    <div class="center">
      <button class="btn btn-primary" id="login">登录</button>
    </div>
  </form>
</div>
<script>
$(function() {
  $('#login').click(function(e) {
    e.preventDefault();
    const name = $('input[name=name]').val().trim();
    const password = $('input[name=password]').val().trim();

    if (!name) {
      return message('请输入用户名！');
    }
    if (!password) {
      return message('请输入密码！');
    }

    // 登录请求
    $.ajax({
      url: '/login',
      type: 'POST',
      data: {name: name, password: password},
      dataType: 'json',
      cache: false,
      success: (res) => {
        if (res.code === 200) {
          message('登录成功');
          setTimeout(() => {
            window.location.href ='/articles';
          }, 1000)
        } else {
          message(res.msg);
        }
      },
      error: () => {
        message('服务器异常');
      }
    })
  })
})
</script>
<% include('footer') %>